// 任务二：事件绑定
// 1. 创建一个表单组件，其中包含姓名和电子邮件字段。
// 2. 为每个字段添加 onChange 事件处理器，以更新状态中的相应值。
// 3. 为表单添加一个提交事件处理器，当表单提交时，显示一个消息框（使用 alert 函数或自定义消息组件）


import { useState } from "react"

export default function App2(){
    let [name,setName] = useState('用户名')
    let [email,setEmail] = useState('密码')
    const changetName = (even) => {
        setName(even.target.value)
    }
    const changetEmail = (even) => {
        setEmail(even.target.value)
    }

    return (
        <>
            <h1>任务二分界线</h1>
            <form>
                <p>{name}</p>
                姓名：
                <input type="text" onChange={changetName}/><br />
                <p>{email}</p>
                电子邮件：
                <input type="text" onChange={changetEmail}/><br />
                <button onClick={() => {alert('提交成功')}}>提交</button>
            </form>
        </>
    )
}